﻿@namespace MudBlazor.Docs.Examples

<MudGrid>
    <MudItem xs="12" md="12">
        <MudPaper Class="d-flex flex-row py-2 px-1">
            <MudPaper Class="pa-2 mx-2 mud-theme-primary">Flex Item 1</MudPaper>
            <MudPaper Class="pa-2 mx-2 mud-theme-secondary">Flex Item 2</MudPaper>
            <MudPaper Class="pa-2 mx-2 mud-theme-info">Flex Item 3</MudPaper>
        </MudPaper>
    </MudItem>
    <MudItem xs="12" md="12">
        <MudPaper Class="d-flex flex-row-reverse py-2 px-1">
            <MudPaper Class="pa-2 mx-2 mud-theme-primary">Flex Item 1</MudPaper>
            <MudPaper Class="pa-2 mx-2 mud-theme-secondary">Flex Item 2</MudPaper>
            <MudPaper Class="pa-2 mx-2 mud-theme-info">Flex Item 3</MudPaper>
        </MudPaper>
    </MudItem>
    <MudItem xs="12" md="6">
        <div class="d-flex flex-column">
            <MudPaper Class="my-2 pa-4 mud-theme-primary">Flex Item 1</MudPaper>
            <MudPaper Class="my-2 pa-4 mud-theme-secondary">Flex Item 2</MudPaper>
            <MudPaper Class="my-2 pa-4 mud-theme-info">Flex Item 3</MudPaper>
        </div>
    </MudItem>
    <MudItem xs="12" md="6">
        <div class="d-flex flex-column-reverse">
            <MudPaper Class="my-2 pa-4 mud-theme-primary">Flex Item 1</MudPaper>
            <MudPaper Class="my-2 pa-4 mud-theme-secondary">Flex Item 2</MudPaper>
            <MudPaper Class="my-2 pa-4 mud-theme-info">Flex Item 3</MudPaper>
        </div>
    </MudItem>
</MudGrid>

